<!DOCTYPE html>
<html>
    <head>
        <title>Home | VTVNOW</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">
        <meta name="format-detection" content="telephone=no">
        <link href="public/css/style.css" rel="stylesheet"/>

        <link href="public/css/perfect-scrollbar.css" rel="stylesheet"/>
        <link href="public/css/jquery.bxslider.css" rel="stylesheet"/>

        <script type="text/javascript" src="public/js/jquery-2.0.2.min.js"></script>
        <script type="text/javascript" src="public/js/perfect-scrollbar.js"></script>
        <script type="text/javascript" src="public/js/jquery.mousewheel.js"></script>

        <script type="text/javascript" src="public/js/jquery.easing.1.3.js"></script>
        <script type="text/javascript" src="public/js/jquery.bxslider.min.js"></script>
        <script type="text/javascript">
            $(function () {
                var cH = ($("#content").height() - 72) / 2;
                $(".slider li .item").css({height: cH + "px"});

                $('.bxslider').bxSlider({
                    pager: false
                });


                $(window).resize(function () {
                    var cH = ($("#content").height() - 72) / 2;
                    $(".slider li .item").css({height: cH + "px"});
                });
            });
        </script>
    </head>
    <body>
        <div id="sidebar">
            <div class="inner">
                <a id="logo" href="http://hoakhoiaodai.vtvnow.vn/"><img src="public/images/vtv-now.png"/></a>
                <div class="scroller">
                    <div class="scroll_inner">
                        <ul class="menu">
                            <li class="active"><a href="http://hoakhoiaodai.vtvnow.vn/"><span>Trang chủ</span></a></li>
                            <li><a href="http://hoakhoiaodai.vtvnow.vn/tai-khoan.html"><span>Tài khoản</span></a></li>
                            <li><a href="http://hoakhoiaodai.vtvnow.vn/chuong-trinh/van-de-hom-nay-vtv1.html"><span>Vấn Đề Hôm Nay - VTV1</span></a> <button class="btn btn-unfollow"></button></li>
                            <li><a href="http://hoakhoiaodai.vtvnow.vn/chuong-trinh/duong-len-dinh-olympia-vtv3.html"><span>Đường lên đỉnh Olympia - VTV3</span></a> <button class="btn btn-unfollow"></button></li>
                            <li><a href="http://hoakhoiaodai.vtvnow.vn/chuong-trinh/bo-oi--minh-di-dau-the-vtv6.html"><span>Bố ơi! Mình đi đâu thế? - VTV6</span></a> <button class="btn btn-follow"></button></li>
                            <li><a href="http://hoakhoiaodai.vtvnow.vn/chuong-trinh/on-gioi-cau-day-roi-vtv3.html"><span>Ơn giời cậu đây rồi - VTV3</span></a> <button class="btn btn-follow"></button></li>
                            <li><a href="http://hoakhoiaodai.vtvnow.vn/chuong-trinh/bua-trua-vui-ve-vtv6.html"><span>Bữa Trưa Vui Vẻ - VTV6</span></a> <button class="btn btn-unfollow"></button></li>
                            <li><a href="http://hoakhoiaodai.vtvnow.vn/chuong-trinh/hoa-khoi-ao-dai-vtv6.html"><span>Hoa Khôi Áo Dài - VTV6</span></a> <button class="btn btn-unfollow"></button></li>
                        </ul>
                    </div>
                </div>
                <div class="footer">
                    <div class="apps">
                        <a class="ios qrcode" href="#"></a>
                        <a class="android qrcode" href="#"></a>
                        <a class="wp qrcode" href="#"></a>

                        <div class="dialog-qr">
                            <div class="dialog-qr-outside"></div>
                            <div class="dialog-qr-box">
                                <div class="dialog-qr-inside">
                                    <img class="qr-ios" alt="qrcode ios version" src="public/images/qrcode.png"/>
                                    <img class="qr-android" alt="qrcode android version" src="public/images/qrcode.png"/>
                                    <img class="qr-wp" alt="qrcode wp version" src="public/images/qrcode.png"/>
                                    <p>Quét mã QR Code để tải ứng dụng về điện thoại</p>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="info">
                        Sản phẩm của <img src="public/images/vtv-digital.png" alt=""/>
                        <p>Phát triển bởi <a href="#">Gvtechcom</a></p>
                    </div>
                </div>       
            </div>
        </div>
        <div id="headerbar">
            <a href="#" class="logo"></a>
            <div class="actions">
                <a href="#" class="selected"><span class="icon-home"></span></a>
                <a href="#"><span class="icon-user"></span></a>
                <a href="#"><span class="icon-channel"></span></a>
            </div>
        </div>s
        <div id="content">
            <div class="inner">
                <div class="main-area">
                    <div id="slide_tvshow">
                        <ul class="bxslider">
                            <li>
                                <img src="public/uploads/slides.jpg" alt=""/>
                            </li>
                            <li>
                                <img src="public/uploads/slides.jpg" alt=""/>
                            </li>
                            <li>
                                <img src="public/uploads/slides.jpg" alt=""/>
                            </li>
                        </ul>
                        <div class="statusbar">
                            <div class="status">

                            </div>
                            <div class="info">
                                <div class="logo" style="background: url(public/images/vtv6.png)"></div>
                                <div class="schedule">
                                    <span class="icon-clock"></span>
                                    12h hàng ngày
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="welcome floatLeft">Xin chào <span>Anh Tú</span> | <a style="font-weight: bold;color: #6b4114" href="#">Thoát</a></div>
                    <div class="floatRight change-desktop"><a class="btn btn-change" href="#"></a></div>

                    <div class="clear"></div>
                    <div class="avatar">
                        <input style="top: 0;opacity: 0;position: absolute;height: 100%;width: 100%;cursor: pointer" onchange="loadImageFileAsURL(1);" id="photo1" type="file" name="photo" accept="image/*" capture="camera"/>
                    </div>		
                    <div class="user-info">
                        <p><label>Tên:</label> <span><input class="input-edit" id="fullname" name="fullname" readonly="true" value="Chưa cập nhật" /></span><button class="btn edit edituser"></button></p>
                        <p><label>Email:</label> <span><input class="input-edit" id="email" name="email" readonly="true" value="Chưa cập nhật" /></span><button class="btn edit edituser"></button></p>
                        <p><label>Địa chỉ:</label> <span><input class="input-edit" id="address" name="address" readonly="true" value="Chưa cập nhật" /></span><button class="btn edit edituser"></button></p>
                        <p><label>Điện thoại:</label> <span><input class="input-edit" id="mobile" name="mobile" readonly="true" value="Chưa cập nhật" /></span><button class="btn edit edituser"></button></p>
                        <p class="html_button"><button class="btn save_info"></button></p>
                    </div>
                    <div class="change-mobile"><a class="btn btn-change" href="#"></a></div>

                    <script>

                        function loadImageFileAsURL(chose)
                        {
                            var chose = chose;
                            var filesSelected = document.getElementById("photo" + chose).files;
                            if (filesSelected.length > 0)
                            {
                                var fileToLoad = filesSelected[0];
                                var fileReader = new FileReader();
                                fileReader.onload = function (fileLoadedEvent)
                                {
                                    var textAreaFileContents = document.getElementById
                                            (
                                                    "textAreaFileContents"
                                                    );
                                    localStorage.imgbase64 = fileLoadedEvent.target.result;
                                    //$('.Avatar').css("background-image", "url(" + fileLoadedEvent.target.result + ")");
                                    //$(".avatar img").attr("src",fileLoadedEvent.target.result);
                                    $('.avatar').css('background', 'url(' + fileLoadedEvent.target.result + ')');

                                    //$(".User_name").css({color: "#000000"});
                                };

                                fileReader.readAsDataURL(fileToLoad);
                            }
                        }
                    </script>
                    <script>
                        $(function ($)
                        {
                            $(".edituser").click(function ()
                            {
                                _this = $(this);
                                _this.parent('p').find('.input-edit').addClass('edit-input-info').attr('readonly', false);
                                _this.parent('p').find('label').css('width', '30%');
                                $(".html_button").show();
                                $(".save_info").click(function () {
                                    var fullname = $("#fullname").val();
                                    if (fullname == "") {
                                        fullname = 'Đang cập nhật';
                                    }
                                    var email = $("#email").val();
                                    if (email == "") {
                                        email = 'Đang cập nhật';
                                    }
                                    var address = $("#address").val();
                                    if (address == "") {
                                        address = 'Đang cập nhật';
                                    }
                                    var mobile = $("#mobile").val();
                                    if (mobile == "") {
                                        mobile = 'Đang cập nhật';
                                    }
                                    $('.input-edit').removeClass('edit-input-info').attr('readonly', true);
                                     _this.parents('.user-info').find('label').css('width', 'auto');
                                     $(".html_button").hide();
                                    /*$.ajax({
                                     type: "GET",
                                     url: '<?php echo $baseurl.'ajax-update-info'?>',
                                     data: {
                                     fullname: fullname,
                                     email: email,
                                     address: address,
                                     mobile: mobile,
                                     },
                                     success: function (data) {
                                     if (data == 200) {
                                     $(".notification").css("display", "block");
                                     $(".content_notification").html("Cập nhật thành công");
                                     $(".welcome span").html(fullname);
                                     $('.input-edit').removeClass('edit-input-info').attr('readonly', true);
                                     _this.parents('.user-info').find('label').css('width', 'auto');
                                     $(".html_button").hide();
                                     } else {
                                     if (data == 201) {
                                     return false;
                                     }
                                     }
                                     }
                                     }); // end ajax*/
                                });
                            });
                        });

                        if (localStorage.imgbase64) {
                            $('.avatar').css('background', 'url(' + localStorage.imgbase64 + ')');
                        } else {
                            $('.avatar').css('background', '');
                        }
                    </script>
                </div>
            </div>
        </div>

        <script type="text/javascript" src="public/js/custom.js"></script>
    </body>
</html>
